<template>
    <el-date-picker v-model="model" type="date" :editable="false" :placeholder="placeholder" :picker-options="pickerOptions" @change="change" style="width:100%">
    </el-date-picker>
</template>

<script>
export default {
    props: {
        placeholder: {
            type: String,
            default: '选择结束日期'
        },
        pickerOptions: {
            type: Object,
            required: true
        },
        startDateOptions: {
            type: Object,
            required: true
        },
        value: {
            type: [String, Date],
            required: true
        }
    },
    data() {
        return {
            oldStartDateDisabled: null
        }
    },
    created() {
        this.oldStartDateDisabled = this.startDateOptions.disabledDate;
        this.change(this.value);
    },
    computed: {
        model: {
            get() {
                return this.value;
            },
            set(date) {
                this.$emit('input', date);
            }
        }
    },
    methods: {
        change(date) {
            let oldStartDateDisabled = this.oldStartDateDisabled;
            this.$emit('update:startDateOptions', {
                disabledDate(time) {
                    return time.getTime() > new Date(date).getTime() - 864e5 || (oldStartDateDisabled && oldStartDateDisabled(time));
                }
            });
            this.$emit('change', date);
        }
    }
}
</script>

<style lang="scss" scoped>

</style>

